<template>
  <div class="bs">
    <!-- 顶部 -->
    <Topic :topic-info="topicInfo" @addUser="addUser" />
    <!-- 查询条件 -->
    <TableFilter :search-params.sync="tableParams" :items="searchForm" :is-show-btn-label="false">
      <!-- <template slot="suffix-button">
        <el-button type="danger" icon="el-icon-plus" @click="addUser">新 增</el-button>
      </template> -->
    </TableFilter>
    <!-- table组件 -->
    <SrmTable
      ref="table"
      url="get|/trafficfly-manager/api/users"
      :is-load="true"
      :hidden="true"
      :table-attr="tableAttr"
      :params="tableParams"
      :columns="TableConfig"
      @tableOperate="callBack"
    />
    <Douser :show-user.sync="showUser" :title="title" :edit-data="editData" @search="search" />
  </div>
</template>
<script>
import { searchForm } from './config/Search'
import { TableConfig } from './config/Table'
import Douser from './components/Douser'
import { del, edit } from '@/api/system/user'
export default {
  components: {
    Douser
  },
  data() {
    return {
      topicInfo: {
        title: '后台用户管理',
        interactive: [
          {
            info: '新增',
            click: 'addUser'
          }
        ]
      },
      editData: {},
      tableAttr: { border: true },
      dataList: [],
      title: '新增用户',
      showUser: false,
      loading: false,
      searchForm: searchForm,
      TableConfig: TableConfig,
      tableParams: {
        enabled: '',
        blurry: ''
      }
    }
  },
  mounted() {

  },
  methods: {
    search() {
      this.$refs.table.initTable()
    },
    callBack(v, d, n) {
      this[v](d, n)
    },
    // statua
    updatwStatus(v) {
      this.$confirm(`此操作将 ${v.state ? '激活' : '禁用'} ${v.username}, 是否继续？`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        edit(v).then(res => {
          this.$refs.table.initTable()
          this.$message.success('操作成功~')
        }).catch(() => {
          v.enabled = !v.enabled
        })
      }).catch(() => {
        v.enabled = !v.enabled
      })
    },
    editUser(v) {
      this.editData = v
      this.showUser = true
      this.title = '编辑用户'
    },
    // delet
    deletUser(v) {
      this.$confirm('确认要删除吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        del([v.id]).then(res => {
          this.$refs.table.initTable()
          this.$message.success('操作成功~')
        })
      })
    },
    addUser() {
      this.showUser = true
      this.title = '新增用户'
    },
    pagination(v) {
      const { page, limit } = v
      this.page.page = page
      this.page.size = limit
      this.initUserData()
    }
  }
}
</script>
<style scoped lang="scss">

</style>
